<template>
    <div>
        <my-nav-bar
            fixed
            title="开关，兄弟"
            left-text="返回"
            right-text="按钮"
            @click-left="onClickLeft"
            @click-right="onClickRight"
        ></my-nav-bar>
        <h2 class="title" style="margin-top: 46px;">开关类型</h2>
        <ul class="con-s">
            <li >
                <label for="">true / active</label>
                <my-switch v-model="switch1" />
            </li>
            <li >
                <label for="">true / active</label>
                <my-switch v-model="switch1" :size="params"  :disabled="switch1"/>
            </li>
        </ul>
    </div>
</template>
<script>
export default {
  data() {
    return {
      switch1: true,
      switch2: false,
      switch3: true,
      switch4: false,
      switch5: true,
      switch6: false,
      color:'#5a3cc4',
      params: 'large'
    };
  },
  methods: {
    onClickLeft() {
      this.$router.$go(-1);
    },

    onClickRight() {
      console.log("right");
    }
  }
};
</script>
<style lang="less" scoped>
ul{
    width: 100%;
    height: 50px;
    line-height: 50px;
    margin-left: 15px;
}
</style>
